<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1"/>
    <meta charset="utf-8"/>
    <title>米塔云平台管理系统</title>
    <link href="../plugins/selectivity/selectivity-jquery.css" rel="stylesheet">
    <link href="../plugins/bootstrap/bootstrap.min.css" rel="stylesheet"/>
    <link href="../plugins/bootstrapValidator/bootstrapValidator.min.css" rel="stylesheet"/>
    <link href="../plugins/font-awesome/css/all.min.css" rel="stylesheet"/>
    <link href="../customize/css/iconfont.css" rel="stylesheet">
    <link href="../customize/css/content.css" rel="stylesheet"/>
    <style>
        .text-linkTrue {
            color: #56c620;
        }

        .text-linkFalse {
            color: #f5232e;
        }

        #d_list .dropdown-toggle::after, #d_list .dropdown-toggle::before {
            display: none
        }
    </style>
</head>
<body>
<div class="m-3">
    <div class="custom-section">
        <nav class="mb-3">
            <ol class="breadcrumb">
                <li class="breadcrumb-item"><i class="iconfont icon-xiaolan6"></i> 设备管理</li>
                <li class="breadcrumb-item active"><i class="iconfont icon-xiaolan2"></i> 采集设备管理</li>
            </ol>
        </nav>
        <div class="d-flex align-items-center justify-content-between mb-3">
            <div class="form-row align-items-center" shiro:hasAnyPermission="device:sensor:view,device:sensor:opera">
                <div class="col-auto">
                    <strong class="font-p14">快捷查询：</strong>
                </div>
                <div class="col-auto">
                    <input type="text" class="form-control" placeholder="快捷查询" id="param-id">
                </div>
                <div class="col-auto">
                    <div class="selectivity-input form-control" id="search_company" style="min-width: 210px;"></div>
                </div>
                <div class="col-auto">
                    <select class="form-control" id="bind">
                        <option value="0">采集设备是否绑定-全部</option>
                        <option value="1">已绑定</option>
                        <option value="2">未绑定</option>
                    </select>
                </div>
                <div class="col-auto">
                    <select class="form-control" id="bind_status">
                        <option value="0">绑定状态-全部</option>
                        <option value="1">否（状态正常）</option>
                        <option value="2">是（状态异常）</option>
                    </select>
                </div>
                <div class="col-auto">
                    <button class="btn btn-primary" type="button" onclick="loadCollectionDevice()"><i
                            class="iconfont icon-dituyechaxun"></i> 查询
                    </button>
                </div>
            </div>
            <div>
                <button shiro:hasPermission="device:sensor:opera" class="btn btn-primary" type="button"
                        onclick="addInfo()"><i class="fa fa-link"></i> 激活采集设备
                </button>
            </div>
        </div>
        <table class="table table-striped table-bordered table-center" id="d_list">
            <!-- <thead>
             <tr>
                 <th>#</th>
                 <th>采集设备编号</th>
                 <th>采集设备名称</th>
                 <th>归属企业</th>
                 <th shiro:hasPermission="device:sensor:opera">操作</th>
             </tr>
             </thead>
             <tbody>

             </tbody>-->
        </table>
        <div id="page" class="page_div"></div>
    </div>
</div>
<!-- Modal -->
<div shiro:hasPermission="device:sensor:opera" class="modal fade" id="addInfoModal" data-backdrop="static"
     tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content text-body" id="addInfoForm">
            <div class="modal-header">
                <div class="modal-title"><i class="iconfont icon-juxing"></i><span id="modal_title">激活采集设备</span></div>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="text-secondary font-p12 mb-2">注：带<span class="form-required">*</span><span
                        class="ml-3"></span>标识的为必填项
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="validationCustom01">采集设备编号<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <input type="hidden" name="id" id="d-id">
                        <input class="form-control" type="text" name="sn" id="validationCustom01">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="validationCustom02">采集设备名称<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="name" id="validationCustom02">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="company-list">归属企业<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <div class="selectivity-input form-control" id="company-list"
                             onchange="companyChange($(this).selectivity('val'))"></div>
                        <input class="form-control position-absolute" type="text" name="enterpise" id="company-list-vld"
                               style="opacity: 0">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="validationCustom00">MQTT主题<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <textarea class="form-control" name="clientId" id="validationCustom00" rows="3"></textarea>
                        <!-- <input class="form-control" type="text" name="clientId" id="validationCustom00"> -->
                    </div>
                </div>

                <div class="form-group text-center">
                    <button class="btn btn-info" type="button" onclick="connection()">测试连接</button>
                    <input type="hidden" id="status" value="0">
                </div>
                <div>
                    <div class="mx-3"
                         style="border: 1px solid #97C3FF; padding: 0 5px; background: #EDF5FF; border-radius: 4px;">
                        <div class="d-inline-block font-p14"
                             style="margin-top: -0.7rem; background: #FFFFFF; padding: 0 5px;">
                            连接结果
                        </div>
                        <!-- 连接过程与结果展示 -->
                        <div class="text-center font-p14 text-secondary py-4" id="not"><i
                                class="fa fa-times-circle text-danger"></i> 设备未连接
                        </div>
                        <div class="text-center font-p14 text-secondary py-4" id="try" style="display: none"><i
                                class="fa fa-spinner fa-spin"></i> 正在尝试连接设备
                        </div>
                        <div class="text-center font-p14 text-secondary py-4" id="success" style="display: none"><i
                                class="fa fa-check-circle text-primary"></i> 设备已连接成功！
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button type="submit" class="btn btn-primary">提交保存</button>
            </div>
        </form>
    </div>
</div>
<div shiro:hasPermission="device:sensor:opera" class="modal fade" id="editInfoModal" data-backdrop="static"
     tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <form class="modal-content text-body" id="editInfoForm">
            <div class="modal-header">
                <div class="modal-title"><i class="iconfont icon-juxing"></i><span>修改采集设备信息</span></div>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="text-secondary font-p12 mb-2">注：带<span class="form-required">*</span><span
                        class="ml-3"></span>标识的为必填项
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="validationCustom04">采集设备编号<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="sn" id="validationCustom04" readonly>
                        <input type="hidden" name="id" id="id-id">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="validationCustom05">采集设备名称<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <input class="form-control" type="text" name="name" id="validationCustom05">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="validationCustom06">归属企业<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <div class="selectivity-input form-control" id="validationCustom06"
                             onchange="companyChange_t($(this).selectivity('val'))"></div>
                        <input class="form-control position-absolute" type="text" name="enterpise"
                               id="validationCustom06-vld" style="opacity: 0">
                    </div>
                </div>
                <div class="form-group row">
                    <label class="col-sm-3 col-form-label" for="validationCustom001">MQTT主题<span
                            class="form-required">*</span></label>
                    <div class="col-sm-8">
                        <textarea class="form-control" name="clientId" id="validationCustom001" rows="3"
                                  disabled></textarea>
                        <!-- <input class="form-control" type="text" name="clientId" id="validationCustom001"  disabled> -->
                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button type="submit" class="btn btn-primary">提交保存</button>
            </div>
        </form>
    </div>
</div>
<div class="modal fade" id="deviceConfigModal" data-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered modal-xl" style="width: 1000px">
        <form class="modal-content text-body" id="deviceConfigForm">
            <input type="hidden" name="deviceID" id="device-id">
            <input type="hidden" name="clientID" id="clientID-id">
            <div class="modal-header">
                <div class="modal-title"><i class="iconfont icon-juxing"></i>采集设备设置</div>
                <button type="button" class="close" data-dismiss="modal">
                    <span>&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="text-secondary font-p12 mb-2">注：带<span class="form-required">*</span><span
                        class="ml-3"></span>标识的为必填项
                </div>
                <div class="container">
                    <div class="row">
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3">远程设置供电方式</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline11" name="powerSupply"
                                           class="custom-control-input" value="0" onclick="disableLabel(0)">
                                    <label class="custom-control-label" for="customRadioInline11">三相电</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline12" name="powerSupply"
                                           class="custom-control-input" value="1" onclick="disableLabel(1)">
                                    <label class="custom-control-label" for="customRadioInline12">单相电</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3"
                                                                       for="validationCustom22">远程设置时钟</label>
                            <input class="form-control" type="text" name="clock" id="validationCustom22"
                                   autocomplete="off">
                        </div>
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3"
                                                                       for="validationCustom23">远程配置上传时间</label>
                            <div class="input-group">
                                <input class="form-control" type="number" name="uploadTime" id="validationCustom23">
                                <div class="input-group-append">
                                    <span class="input-group-text">分钟</span>
                                </div>
                            </div>
                            <span class="text-muted font-p12">配置范围1-60分钟</span>
                        </div>
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3">远程配置OUT1</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline21" name="OUT1"
                                           class="custom-control-input" value="1">
                                    <label class="custom-control-label" for="customRadioInline21">打开</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline22" name="OUT1"
                                           class="custom-control-input" value="0">
                                    <label class="custom-control-label" for="customRadioInline22">关闭</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3">远程配置OUT2</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline31" name="OUT2"
                                           class="custom-control-input" value="1">
                                    <label class="custom-control-label" for="customRadioInline31">打开</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline32" name="OUT2"
                                           class="custom-control-input" value="0">
                                    <label class="custom-control-label" for="customRadioInline32">关闭</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3">RS232数据类型</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline41" name="RS232"
                                           class="custom-control-input" value="0" checked>
                                    <label class="custom-control-label" for="customRadioInline41">无</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline42" name="RS232"
                                           class="custom-control-input" value="1">
                                    <label class="custom-control-label" for="customRadioInline42">GPS</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline43" name="RS232"
                                           class="custom-control-input" value="2">
                                    <label class="custom-control-label" for="customRadioInline43">待开发</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3">远程配置电能表接线方式</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline51" name="wiring"
                                           class="custom-control-input" value="1" disabled>
                                    <label class="custom-control-label" for="customRadioInline51">三相四线</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline52" name="wiring"
                                           class="custom-control-input" value="2" disabled>
                                    <label class="custom-control-label" for="customRadioInline52">三相三线</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4" id="RS485">
                            <span class="form-required">*</span><label class="ml-3">RS485数据类型</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline61" name="RS485"
                                           class="custom-control-input" value="0">
                                    <label class="custom-control-label" for="customRadioInline61">无</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline62" name="RS485"
                                           class="custom-control-input" value="1">
                                    <label class="custom-control-label" for="customRadioInline62">职能微断</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline63" name="RS485"
                                           class="custom-control-input" value="2">
                                    <label class="custom-control-label" for="customRadioInline63">待开发</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4" id="blb">
                            <span class="form-required">*</span><label class="ml-3"
                                                                       for="validationCustom24">远程配置电能表变流比</label>
                            <input class="form-control" type="number" name="variableFlowRatio" id="validationCustom24">
                        </div>
                        <div class="form-group col-4" id="wgsc">
                            <span class="form-required">*</span><label class="ml-3">远程配置网格上传</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline71" name="networkUpload"
                                           class="custom-control-input" value="1">
                                    <label class="custom-control-label" for="customRadioInline71">开启</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline72" name="networkUpload"
                                           class="custom-control-input" value="0">
                                    <label class="custom-control-label" for="customRadioInline72">关闭</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4" id="ycxb">
                            <span class="form-required">*</span><label class="ml-3"
                                                                       for="validationCustom25">远程谐波设置</label>
                            <input class="form-control" type="number" name="harmonic" id="validationCustom25">
                            <span class="text-muted font-p12">0为关闭，最大值41</span>
                        </div>
                        <div class="form-group col-4">
                            <span class="form-required">*</span><label class="ml-3">远程配置内置互感器</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline81" name="transformer"
                                           class="custom-control-input" value="1">
                                    <label class="custom-control-label" for="customRadioInline81">有</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline82" name="transformer"
                                           class="custom-control-input" value="0" checked>
                                    <label class="custom-control-label" for="customRadioInline82">无</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4" id="kzwd">
                            <span class="form-required">*</span><label class="ml-3">远程控制微断</label>
                            <div class="d-flex mt-1">
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline91" name="microBreak"
                                           class="custom-control-input" value="0">
                                    <label class="custom-control-label" for="customRadioInline91">分闸</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline92" name="microBreak"
                                           class="custom-control-input" value="1">
                                    <label class="custom-control-label" for="customRadioInline92">合闸</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline93" name="microBreak"
                                           class="custom-control-input" value="2">
                                    <label class="custom-control-label" for="customRadioInline93">锁止</label>
                                </div>
                                <div class="flex-1 custom-control custom-radio custom-control-inline">
                                    <input type="radio" id="customRadioInline94" name="microBreak"
                                           class="custom-control-input" value="3">
                                    <label class="custom-control-label" for="customRadioInline94">解锁</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group col-4" id="byb">
                            <span class="form-required">*</span><label class="ml-3"
                                                                       for="validationCustom26">远程配置电能表变压比</label>
                            <input class="form-control" type="number" name="transformationRatio"
                                   id="validationCustom26">
                        </div>
                        <!-- <div class="form-group col-4">
                             <span class="form-required">*</span><label class="ml-3" for="validationCustom27">设置MQTT IP</label>
                             <input class="form-control" type="text" name="MQTTIP" id="validationCustom27">
                         </div>-->
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button type="submit" class="btn btn-primary">提交保存</button>
            </div>
        </form>
    </div>
</div>
<script src="../plugins/jquery-3.4.1.min.js"></script>
<script src="../plugins/bootstrap/bootstrap.bundle.min.js"></script>
<script src="../plugins/bootstrapValidator/bootstrapValidator.min.js"></script>
<script src="../plugins/bootstrapValidator/zh_CN.js"></script>
<script src="../plugins/alert.js"></script>
<script src="../plugins/paging.js"></script>
<script src="../plugins/selectivity/selectivity-jquery.js"></script>
<script src="../plugins/laydate/laydate.js"></script>
<script src="../customize/js/common.js"></script>
<script src="../customize/js/CommonUtils.js"></script>
<script src="../customize/js/customModalV2.js"></script>
<script src="../customize/js/acqEquManagement.js"></script>
<script>
    var deviceSensorView = false;
    var deviceSensorOpera = false;
    var title = ['#', '采集设备编号', '采集设备名称', '添加时间', '归属企业', '采集设备是否绑定', '当前绑定是否断开', '数据断传时间(小时)'];
    var label = ['order', 'sn', 'name', 'createTime', 'ename', 'isBind', 'linkLoss', 'lossTime'];
</script>
<shiro:hasPermission name="device:sensor:view">
    <script>
        deviceSensorView = true;
    </script>
</shiro:hasPermission>
<shiro:hasPermission name="device:sensor:opera">
    <script>
        deviceSensorOpera = true;
        label.push('opera');
        title.push('操作');
    </script>
</shiro:hasPermission>
</body>
</html>